<template>
  <div >
      <swiper v-if="banners.length">
      <div class="swiper-slide" v-for="(item,index) in banners" :key="index">
        <a :href="item.link">
          <img :src="item.image" alt="" @load="imageLoad">
        </a>
      </div>
    </swiper>
  </div>
</template>

<script>
import Swiper from "components/common/swiper/Swiper.vue";

export default {
  components: {
      Swiper
  },
  props: {
      banners:{
          type:Array,
          default() {
              return []
          }
      }
  },
  data() {
    return {
      isLoad:false
    };
  },
  watch: {},
  computed: {},
  methods: {
    imageLoad() {
      if (!this.isLoad) {
        this.$emit('swiperImageLoad');
        this.isLoad=true;
      }
      // console.log('---');
      
    }
  },
  created() {},
  mounted() {}
};
</script>
<style  scoped>
.swiper-slide img{
      width: 100%;
    }
</style>